import React, {Component} from 'react';
import {Table, Modal} from "antd";
import {withRouter} from "react-router-dom";
import ResumeDetailView from '../../components/resume-detail/index'
import {reqPrivateResume} from '../../api/index'
import memoryUtils from "../../utils/memoryUtils";
import {PAGE_SIZE} from "../../utils/constants";

import './resume-public.less'


/*
* 求职者信息路由*/
class Private extends Component {

    state = {
        selectedRowKeys: [], // Check here to configure the default column
        size: 'default',
        bordered: true,
        searchText: '',
        visible: false,
        resume: [],//当前页面简历列表
        loading: false,//是否正在加载中
        count: 0,
    };

    //初始化Table所有列的数组
    initColumns = () => {
        this.columns = [
            {
                title: '姓名',
                dataIndex: 'name',
                key: 'name',
                fixed: 'left',
                width: 100,
            },
            {
                title: '基本信息',
                children: [
                    {title: '手机号', dataIndex: 'phone', key: 'phone',width: 150, },
                    {title: '性别', dataIndex: 'gender', key: 'gender',width: 100, },
                    {title: '年龄', dataIndex: 'age', key: 'age', width: 100,},
                    {title: '学历', dataIndex: 'education', key: 'education', width: 100,},
                    {title: '籍贯', dataIndex: 'city', key: 'city',width: 100,},
                    {
                        title: '现居住地',
                        dataIndex: 'location',
                        key: 'location',
                        width: 100,
                    },
                    {title: '求职状态', dataIndex: 'status', key: 'status',width: 100,},

                ]
            },
            {
                title: '工作经验',
                children: [
                    {
                        title: '工作时间',
                        dataIndex: 'worktime',
                        key: 'worktime',
                        width: 100,
                    },
                    {title: '所在行业', dataIndex: 'now_trade', key: 'now_trade',width: 150,},
                    {
                        title: '岗位名称',
                        dataIndex: 'now_postion',
                        key: 'now_postion',
                        width: 150,
                    },
                ]
            },
            {
                title: '求职期望',
                children: [
                    {
                        title: '期望职位',
                        dataIndex: 'exp_postion',
                        key: 'exp_postion',
                        width: 150,
                    },
                    {
                        title: '期望行业',
                        dataIndex: 'exp_trade',
                        key: 'exp_trade',
                        width: 150,
                    },
                    {
                        title: '期望薪资',
                        dataIndex: 'exp_salary',
                        key: 'exp_salary',
                        width: 150,
                    },
                ]
            },
            {
                title: '不接受项',
                children: [
                    {title: '排斥行业', dataIndex: 'rej_trade', key: 'rej_trade',width: 150, },
                    {
                        title: '排斥工作',
                        dataIndex: 'rej_postion',
                        key: 'rej_postion',
                        width: 150,
                    },
                ]
            },
            {
                title: '操作',
                key: 'operation',
                fixed: 'right',
                width: 150,
                render: (results) => <span onClick={()=>this.openResume(results)}><a>查看简历详情</a></span>,
            },
        ]
    }

    initData = async (page) => {
        this.setState({loading: true})//显示loading
        const result = await reqPrivateResume(page,PAGE_SIZE)
        this.setState({loading: false})//隐藏
        const count=result.data.count
        const data=[]
        if (result.status === 200) {
            //请求成功
            const resume = result.data.results
            resume.map(item => data.push({
                key:item.id,
                name: item.name,
                phone:item.phone,
                gender: item.gender,
                age: item.age,
                education: item.education,
                city: item.city,
                location: item.location,
                status: item.status,
                worktime: item.worktime,
                now_trade: item.now_trade,
                now_postion: item.now_postion,
                exp_postion: item.exp_postion,
                exp_trade: item.exp_trade,
                exp_salary: item.exp_salary,
                rej_trade: item.rej_trade,
                rej_postion: item.rej_postion,
            }))
        }
        this.setState({
            resume: data,
            count:count
        })
    }

    //打开简历详情
    openResume = (results) => {
        memoryUtils.resumeDetail = results//保存在内存中
        this.setState({
            visible: true,
        });
    }

    handleCancel = e => {
        memoryUtils.resumeDetail=[]
        this.setState({
            visible: false,
        });
    };

    //为第一次render()准备数据
    componentWillMount() {
        this.initColumns()
    }

    //发异步ajax请求
    componentDidMount() {
        this.initData()
    }

    render() {
        //读取状态数据
        const {resume,count,loading} = this.state;
        return (
            <div>
                <div className="resume-public">
                    <span style={{marginLeft:50}}>共{count}条简历</span>
                    <div className="search-border">
                        <div className="search">
                        </div>
                    </div>
                </div>
                <Modal
                    title="个人简历"
                    visible={this.state.visible}
                    onCancel={this.handleCancel}
                    centered={true}
                    width="50%"
                >
                    <ResumeDetailView></ResumeDetailView>
                </Modal>
                <Table {...this.state}
                       columns={this.columns}
                       scroll={{x:'150%',y:'100%'}}
                       dataSource={resume}
                       loading={loading}
                       pagination={{
                           total: count,
                           defaultPageSize: PAGE_SIZE,
                           onChange: (page) => {
                               this.initData(page)
                           }
                       }}/>
            </div>
        )
    }
}

export default withRouter(Private);
